<template>
  <div>
    <!--html布局-->
    <!--工具类-->
    <Row>
      <i-col span="24" class-name="y_query_right">
        <Button type="primary" icon="flash" class="y_condition" v-if="param.products.length > 0 "
                v-has=tRole.PRODUCT_1_105 @click="productBatchSale">{{status.saleTitle}}</Button>
        <Button type="primary" icon="trash-b" class="y_condition" v-if="param.products.length>0"
                @click="productBatchDelete" v-has=tRole.PRODUCT_1_106>删除</Button>
        <Button type="primary" icon="cube" class="y_condition"
                v-if="param.products.length > 0  && status.topHidden"
                @click="productBatchTop" v-has=tRole.PRODUCT_1_107>{{status.topTitle}}</Button>
        <Button type="primary" icon="cube" class="y_condition" @click="productBatchSequenceView"
                v-if="param.products.length > 0" v-has=tRole.PRODUCT_1_104>确认排序</Button>
        <Button type="info"  class="y_condition" @click="showEmptyStock" v-has=tRole.PRODUCT_1_109>排查无库存产品</Button>
        <Button type="info" icon="ios-cloud-upload-outline" class="y_condition" @click="updateCloudIndex" v-has=tRole.PRODUCT_1_108>更新产品搜索</Button>
        <Button type="primary" icon="md-add" class="y_condition" @click="showProductAddModal" v-has=tRole.PRODUCT_1_101>新增</Button>
      </i-col>
    </Row>
    <hr>
    <Row v-has=tRole.PRODUCT_1_100 >
      <i-col span="24" class="y_query_right">
        <Cascader :data="categoryList" @on-change="categorySelected" change-on-select clearable placeholder="产品分类" class="y_condition" style="text-align: left; max-width: 200px;"></Cascader>
        <Input placeholder="产品编号" v-model.trim="param.productCode"  class="y_condition"></Input>
        <Input placeholder="货源编号" v-model.trim="param.collectionProductCode"  class="y_condition"></Input>
        <Select v-model="param.sourceState" placeholder="产品货源状态" clearable class="y_condition" style="text-align: left;">
          <Option v-for="(item, index) in sourceStates" :value="item.value">{{item.label}}</Option>
        </Select>
        <span style="display: inline-block;">产品状态 :
          <RadioGroup v-model="param.is_prefer">
            <Radio label="3"><span>新建未上架</span></Radio>
            <Radio label="0"><span>已上架</span></Radio>
            <Radio label="-1"><span>已下架</span></Radio>
          </RadioGroup>
        </span>
        <Button type="primary" icon="md-search"  class="y_condition" @click="search">查询</Button>
      </i-col>
      </Row>
    <hr style= "border:0.5px dashed #f3f3f6" />
    <Row style="margin-top: 16px;text-align: right" class-name="y_query_right" v-show="false">
      <Button type="success" icon="ios-download" ghost class="y_condition" @click="exportExcelForExhibit" v-has=tRole.PRODUCT_1_102>导出展会产品</Button>
      <Button type="success" icon="ios-download" ghost class="y_condition" @click="showExportDialog" v-has=tRole.PRODUCT_1_102>按编号导出</Button>
      <Button type="success" icon="ios-download" ghost class="y_condition" @click="exportExcel(0, true)" v-has=tRole.PRODUCT_1_102>全部/按分类导出</Button>
      <Button type="success" icon="ios-download" ghost class="y_condition" @click="exportExcel(1, false)" v-has=tRole.PRODUCT_1_103>导出上周下架产品</Button>
    </Row>

    <!--新产品/编辑产品 弹出框-->
    <Modal
      v-model="statusAddEdit.modalModify.isShow"
      title=""
      :mask-closable="false"
      :closable="statusAddEdit.modalModify.closable"
      :styles="{top: '20px',bottom:'20px',width:'85%'}">
      <a-productAddEdit ref="AProductAddEdit"></a-productAddEdit>
      <div slot="footer"></div>
    </Modal>

    <!--通过抓取创建新产品弹出框-->
    <Modal
      v-model="addByCrawlerStatus.modalAddByCrawler.isShow"
      title=""
      :mask-closable="false"
      :styles="{top: '20px',bottom:'20px',width:'75%'}">
      <a-productCrawler ref="AProductCrawler"></a-productCrawler>
      <div slot="footer"></div>
    </Modal>

    <!--产品排序 弹出框-->
    <Modal
      v-model="status.modalSequence.isShow"
      title="确认排序"
      :loading="status.modalSequence.isLoading">
      <div slot="footer"></div>
      <Row>
        <i-col span="24"><Alert type="warning">提示:数字越小排序越靠前,置顶排序为100,排序不能小于0。</Alert></i-col>
      </Row>
      <Row style="margin-top: 10px">
        <i-col span="14"><span>已选择{{param.products.length}}个产品进行排序</span></i-col>
        <i-col span="10">
          <InputNumber v-model="param.squence.squenceNumber" :min=0></InputNumber>
        </i-col>
      </Row>
      <Row v-show="status.modalSequence.isError">
        <i-col span="24">{{status.modalSequence.errorMsg}}</i-col>
      </Row>
      <Row>
        <i-col span="24" style="margin-top: 10px">
          <div style="text-align: center">
            <Button  class="tiy_btn" @click="closeBatchSequences">返回</Button>
            <Button type="primary" class="tiy_btn" @click="productBatchSequences">保存
            </Button>
          </div>
        </i-col>
      </Row>

    </Modal>

    <!--确认弹出框-->
    <Modal
      v-model="status.modalAction.isShow"
      :title="status.modalAction.title"
      :loading="status.modalAction.isLoading"
      @on-ok="actionOk">
      <br>
      <p>{{status.modalAction.content}}?</p>
      <br>
    </Modal>

    <!--查看图片弹出框-->
    <Modal
      v-model="status.modalImage.isShow"
      title=""
      :styles="{align:'center'}">
      <!--:scrollable=true -->

      <div slot="footer"></div>
      <div align="center"><Img :src="status.modalImage.url" style="max-width: 300px"/></div>
    </Modal>

    <!--表格和分页-->
<!--    <Table stripe border class="base_table" ref="selection"-->
<!--           :columns="tableTitles" :data="productList"-->
<!--           no-data-text="暂无数据"-->
<!--           @on-select="productSelected"-->
<!--           @on-select-cancel="productSelectedCancel"-->
<!--           @on-selection-change="productSelectedChanged"-->
<!--           @on-sort-change="productSortChanged"-->
<!--           :resizable="true"-->
<!--           border></Table>-->

    <List style="border-bottom: 1px solid #e8eaec;margin-top: 1rem;margin-bottom: 1rem;">
      <ListItem style="display: flex;align-items: flex-start;margin-left: 1rem;">
        <Checkbox v-model="isCheckedAllMessage" @on-change="handleCheckAll">全选</Checkbox>
        <ListSort sort-label="创建时间" :sort-by="param.orderBy" sort-value="createtime" @change="productSortChanged"></ListSort>
        <ListSort sort-label="上/下架时间" :sort-by="param.orderBy" sort-value="lastmodify" @change="productSortChanged"></ListSort>
      </ListItem>
      <template v-if="productList.length == 0">
        <ListItem><div style="width: 100%; text-align: center;">暂无数据</div></ListItem>
      </template>
      <CheckboxGroup v-model="param.products" @on-change="checkChange">
        <list-item class="list_item" v-for="(item,index) in productList">
        <div style="width:100%;padding: 0 0.5rem;"  >
          <Row type="flex" justify="space-between" align="middle">
            <i-col :xs="2" :sm="1" >
              <Checkbox :label="item" :value="index">{{ check }}</Checkbox>
            </i-col>
            <i-col  :xs="5" :sm="2" style="text-align: left">
              <img :src="getProductZipImage(item)"
                   style="width:99%;max-width:70px;max-height:70px;"
                   @click="status.modalImage.url=item.productImg;status.modalImage.isShow = true;"/>
            </i-col>
            <i-col :xs="17" :sm="17" style="text-align: left;padding-left: 0.5rem;" >
              <Div>
                <KeyValueView>#{{index+1}}</KeyValueView>
                <KeyValueView title="SKU">
                  <a :href="$tiyProductUrl(item.code)" target="_blank">{{item.code}}</a>
                </KeyValueView>
                <KeyValueView v-has=tRole.PRODUCT_1_205 title="订单数">
                  <a @click="showOrderList(index)" v-if="item.orderCount>0" style="padding: 0.1rem 0.5rem;font-weight: 600">{{item.orderCount}}</a>
                  <span v-else>无</span>
                </KeyValueView>
              </Div>
              <KeyValueView title="价格">{{getProductPrice(item)}}</KeyValueView>
              <KeyValueView title="起订量">{{item.minOrder}}</KeyValueView>
              <KeyValueView title="排序">{{item.sequence}}</KeyValueView>
              <KeyValueView title="货源状态">{{getSourceState(item.sourceState)}}</KeyValueView>
              <Div>
                <KeyValueView title="创建时间" >{{ $tiyBJTime(item.createtime) }}</KeyValueView>
                <KeyValueView  title="最后上/下架时间">{{$tiyBJTime(item.lastmodify)}}</KeyValueView>
              </Div>

            </i-col>
            <i-col :xs="24" :sm="4" >
              <Button v-has=tRole.PRODUCT_1_210  ghost size="small" icon="md-create" type="primary" @click="editItem(index)" style="margin-right: 0.5rem">编辑</Button>
              <Button v-has=tRole.PRODUCT_1_211 ghost size="small" icon="md-trash" type="error"  @click="deleteItem(index)" >删除</Button><br>
              <Button v-has=tRole.PRODUCT_1_212 ghost size="small" icon="md-flash" type="primary" @click="upOrDownItem(index)" style="margin-right: 0.2rem;margin-top: 0.4rem;">{{item.state === 0 ? '下架' : "上架"}}</Button>
              <Button v-has=tRole.PRODUCT_1_213 ghost size="small" type="error"  @click="topOrBottomItem(index)" style="margin-top: 0.4rem;">{{item.sequence === 100 ? '取消置顶' : "一键置顶"}}</Button>
            </i-col>
          </Row>
        </div>
      </list-item>
      </CheckboxGroup>
    </List>

    <div style="float: right;">
      <Page :total="page.total" :page-size="page.stepNumber" :current="page.currentPage" @on-change="changePage"
            @on-page-size-change="sizeChange" :page-size-opts="[40,60,80,120]"
            show-sizer show-elevator/>
    </div>

    <!--order弹出框-->
    <Modal
      v-model="status.modalOrder.isShow"
      title="查看订单"
      :styles="{top: '20px',bottom:'20px',width:'80%',}"
      :scrollable=false
      @on-cancel="hideDetail()">

      <!--表格和分页-->
      <Table stripe border :columns="tableOrderTitles" :data="orderList" class="table_css"
             no-data-text="暂无数据"></Table>
    </Modal>

    <a-OrderDetail ref="orderDetail" @hideDetail="hideDetail()" :orderId="orderId" :detailShow="isShowDetail" v-show="isShowDetail" ></a-OrderDetail>

    <!--产品导出 -->
    <Modal v-model="isShowExportDialog" draggable title="产品导出" @on-ok="exportExcel(0, false)">
      <Row><span class="key">拷贝产品编码（以空格分割）</span></Row>
      <Row>
        <textarea v-model.trim="productCodes" style="width:95%;min-height: 120px"></textarea>
      </Row>
    </Modal>

    <!--产品导出错误提示-->
    <Modal v-model="isShowErrorExportDialog" draggable title="导出成功" @on-ok="">
     <Row><span class="key" style="color:red">以下产品未找到或者产品没有库存：</span></Row>
      <Row>
        <div v-for="item in productErrorCodes" >
          {{item}}
        </div>
      </Row>
    </Modal>

    <!-- 添加产品之前先确定分类和编码 -->
    <Modal v-model="status.modalAdd.isShow" title="新增产品" :width="status.modalAdd.width" :mask-closable="false">
      <Form ref="paramProductForm" :label-width="100" label-position="left" label-colon :model="param.paramProduct" :rules="status.modalAdd.validateRules">
        <FormItem label="产品编号" prop="productCode">
          <Alert type="warning">保存时后台会自动在编号前添加站点的标识字符。</Alert>
          <Input v-model.trim="pCode" style="width: 400px;">
            <span slot="prepend">{{station.skuProfix}}</span>
            <Button slot="append" type="primary" @click="generateRandomSKU()">随机生成</Button>
          </Input>
        </FormItem>
        <FormItem label="产品分类" prop="classificationIds">
          <div>
            <Button type="info" icon="ios-build" ghost @click="status.modalAdd.isClassificationTreeModelShowing=true">选择产品分类</Button>
          </div>
          <i-col  v-for="(item,index) in classificationTreeShow" >
            <span class="tiy_key" style="text-align: left;font-size: 0.5em"  v-if="index<20||status.modalAdd.isShowAllCategories">{{item.level1}} /{{item.level2}}/{{item.level3}}</span>
          </i-col>
          <div style="width: 100%;text-align: right;padding-right:9rem" v-if="classificationTreeShow.length>20">
            <Button type="dashed" size="small" @click="status.modalAdd.isShowAllCategories=!status.modalAdd.isShowAllCategories">{{status.modalAdd.isShowAllCategories?'点我折叠全部分类......':'点我查看分类列表......'}}</Button>
          </div>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button @click="status.modalAdd.isShow=false;">取消</Button>
        <Button type="primary" @click="saveAddProduct()">下一步</Button>
      </div>
    </Modal>

    <!--产品分类选择-->
    <Modal
      :transfer=false
      v-model="status.modalAdd.isClassificationTreeModelShowing"
      title="选择产品所属的分类"
      @on-ok="">
      <div slot="footer"></div>
      <Tree :data="classificationTree" show-checkbox :multiple="true" style="text-align: left;"
            ref="Tree" @on-toggle-expand="toggleExpand"  @on-check-change="changeClassification"></Tree>
    </Modal>
    <!--无库存色卡-->
    <Modal
      v-model="status.modalStockEmpty.isShow"
      title="无库存色卡"
      :mask-closable="false" :scrollable=true :styles="{top: '20px',bottom:'20px',width:'70%'}">
      <div slot="footer">
      </div>
      <a-stock-empty-color></a-stock-empty-color>
    </Modal>

  </div>
</template>

<!--javascript 代码-->
<script>
  import ICol from "../../../node_modules/view-design/src/components/grid/col";
  import tiyData from "./js/list/list_data"
  import tiyAddEditData from "./js/list/add_edit_data"
  import crawlerData from "./js/crawler/crawler_data"
  import AImage from "../image/ImageSelect.vue"
  import AProductAddEdit from "../product/ProductAddEdit.vue"
  import AOrderDetail from "../order/OrderDetail.vue"
  import AProductCrawler from "../product/ProductCrawler.vue"
  import {getProductCommonData, createCategoryList} from "../js/commonUtils"
  import AStockEmptyColor from "../product/ProductStockEmptyColor.vue"
  import KeyValueView from "../widgets/KeyValueView";

  import {makeClassificationTree, modifyProduct, saveAddProduct} from "./js/list/add_edit_fun"
  import {getSourceState} from "./js/list/list_funs"

  import {
    init,
    action,
    actionBatch,
    actionDone,
    webList,
    selectedChange,
    exportExcel,
    batchSequenceView,
    batchSequenceFun,
    showOrderList,
    exportExcelForExhibit,
  } from "./js/list/list_funs"

  import {
      toAddProductByCrawler
  } from  "./js/crawler/crawler_fun"
  import {formatDate} from "../js/dateUtils";
  import Vue from "vue";
  import ListSort from "../widgets/ListSort";

  export default {
    data(){
      return {
        tRole:{
          PRODUCT_1_100:"PRODUCT-1-100",
          PRODUCT_1_101:"PRODUCT-1-101",
          PRODUCT_1_102:"PRODUCT-1-102",
          PRODUCT_1_103:"PRODUCT-1-103",
          PRODUCT_1_104:"PRODUCT-1-104",
          PRODUCT_1_105:"PRODUCT-1-105",
          PRODUCT_1_106:"PRODUCT-1-106",
          PRODUCT_1_107:"PRODUCT-1-107",
          PRODUCT_1_108:"PRODUCT-1-108",
          PRODUCT_1_109:"PRODUCT-1-109",
          PRODUCT_1_205:"PRODUCT-1-205",
          PRODUCT_1_210:"PRODUCT-1-210",
          PRODUCT_1_211:"PRODUCT-1-211",
          PRODUCT_1_212:"PRODUCT-1-212",
          PRODUCT_1_213:"PRODUCT-1-213",
        },
        page: tiyData.tPage,
        productList: [],
        //字典 性别
        sexList: this.$yFreeze(this.$store.getters.dictionaries.genderDict),
        allTabs: this.$yFreeze(this.$store.getters.product.allTabs),
        allSysSize: this.$yFreeze(tiyData.tData.allSysSize),//尺码
        allSysSizeMap:this.$yFreeze(this.$store.getters.product.allSysSize),
        sysSizeTypeDict: this.$yFreeze(this.$store.getters.dictionaries.sysSizeTypeDict),//尺码类型
        categoryList:tiyData.tData.categoryList,//分类控件所需要的数据
        //字典 计价单位
        priceUnits: this.$yFreeze(this.$store.getters.dictionaries.priceUnits),
        tableTitles:this.$yFreeze(tiyData.tTable(this)),
        param: tiyData.tParam,
        status: tiyData.tStatus,
        statusAddEdit:tiyAddEditData.tStatus,
        uploadUrl: this.$yFreeze(this.$apiOther.getUploadToOssUrl()),
        yunPath: this.$store.getters.imgPrefix,
        station: this.$store.getters.siteInfo,
        orderList: tiyData.tData.orderList,
        tableOrderTitles:this.$yFreeze(tiyData.tableOrderTitles(this)),
        orderItemDict: this.$yFreeze(this.$store.getters.dictionaries.orderStateDict),
        isShowDetail:false,
        orderId:'',
        isShowExportDialog:false,
        productCodes:'',
        isShowErrorExportDialog:false,
        productErrorCodes:[],
        addByCrawlerStatus:crawlerData.tStatus,
        classificationTree: tiyData.tData.classificationTree,//分类
        classificationTreeShow: tiyData.tData.classificationTreeShow,
        sourceStates: tiyData.tData.sourceStates,
        check: '',
        isCheckedAllMessage: false,
      }
    },
    methods: {
      getProductZipImage(product){
        let imageUrl = product.productImg;
        let self=this;
        if(product.productShowImg!=null&&product.productShowImg.zipImgs!=null){
          let zipImg = product.productShowImg.zipImgs;
          zipImg.forEach(function (item){
            if(item.size=="200w"){
              imageUrl=self.yunPath+item.imagePath;
            }
          })
        }
        return !imageUrl ? '' : imageUrl;
      },
      getSourceState(state){
        return getSourceState(state);
      },
      getProductPrice(product){
        let price = "";

        if(!product.minPrice){ //正式环境中只要配置了价格就一定有minPrice
          return price;
        }

        let priceArray = [];
        priceArray.push("$" + product.minPrice);
        if(product.currentPrice != product.minPrice){ //不存在有minPrice没有currentPrice的情况
          priceArray.push("$" + product.currentPrice);
        }

        price = priceArray.join(" - ");
        return price;
      },
      showProductAddModal() {//添加产品弹窗
        //表单重置
        this.$refs.paramProductForm.resetFields();
        //构建分类树形结构
        makeClassificationTree(this, tiyData);
        //显示弹窗
        tiyData.tStatus.modalAdd.isShow = true;
      },
      productBatchSale() {
        actionBatch(this, tiyData, 4);
      },
      productBatchDelete() {
        actionBatch(this, tiyData, 3);
      },
      productBatchTop() {
        if (0 == tiyData.tParam.products.length) {
          this.$Message.error('请选择要操作的产品!');
          return;
        }
        tiyData.tParam.squence.squenceNumber = tiyData.tStatus.isTop ? 100 : 10000;
        this.$Modal.confirm({
          title: '调整产品顺序',
          content: '确定' + tiyData.tStatus.topTitle + '?',
          onOk: () => {
            batchSequenceFun(this, tiyData);
          },
        });
      },
      productBatchSequenceView() {
        //选择分类后的条件判断只选择了一级分类
        if (1 != tiyData.tParam.squence.choosedLevel || tiyData.tParam.squence.choosedCategory == "") {
          this.$Modal.warning({
            title: '确认',
            content: '<p>只能在一级分类下排序</p>',
            okText: 'OK',
            cancelText: 'Cancel'
          })
        } else {
          batchSequenceView(this, tiyData);
        }
      },
      productBatchSequences() {
        if(tiyData.tParam.products.length < 1){
          tiyData.tStatus.modalSequence.isError = true;
          tiyData.tStatus.modalSequence.errorMsg = "请选择产品";
          return;
        }
        if(tiyData.tParam.squence.squenceNumber == null){
          tiyData.tStatus.modalSequence.isError = true;
          tiyData.tStatus.modalSequence.errorMsg = "排序值不能为空";
          return;
        }
        if(tiyData.tParam.squence.squenceNumber < 0){
          changeModelLoading(self,tiyData);
          tiyData.tStatus.modalSequence.isError = true;
          tiyData.tStatus.modalSequence.errorMsg = "排序值不能小于0";
          return;
        }
        if(tiyData.tParam.squence.squenceNumber > 2147483647){
          tiyData.tStatus.modalSequence.isError = true;
          tiyData.tStatus.modalSequence.errorMsg = "排序值不能大于2147483647";
          return;
        }
        batchSequenceFun(this, tiyData);
      },
      closeBatchSequences() {
        this.status.modalSequence.isShow = false;
      },
      deleteItem(index) {
        action(this, tiyData, 0, index);
      },
      editItem(index) {
        modifyProduct(this, tiyAddEditData, this.productList[index].id, true);
      },
      upOrDownItem(index) {
        action(this, tiyData, 1, index);
      },
      topOrBottomItem(index) {
        action(this, tiyData, 2, index);
      },
      actionOk() {
        actionDone(this, tiyData);
      },
      search() {
        webList(this, tiyData);
      },
      checkChange() {
        if (this.param.products.length == this.productList.length) {
          this.isCheckedAllMessage = true;
        } else {
          this.isCheckedAllMessage = false;
        }
        selectedChange(this, tiyData, this.param.products);
      },
      handleCheckAll() {
        let self = this;
        if (self.isCheckedAllMessage) {
          self.param.products.splice(0, self.param.products.length);
          for(let i=0;i<self.productList.length;i++){
            self.param.products.push(self.productList[i]);
          }
        } else {
          self.param.products.splice(0, self.param.products.length);
        }
        selectedChange(this, tiyData, this.param.products);
      },
      productSelected(selection, row) {
        tiyData.tParam.products.push(row);
      },
      productSelectedCancel(selection, row) {
        tiyData.tParam.products.pop(row);
      },
      productSelectedChanged(selection) {
        selectedChange(self, tiyData, selection);
      },
      productSortChanged(sortBy) {
        tiyData.tPage.total = 1;
        tiyData.tPage.startIndex = 0;
        tiyData.tPage.currentPage = 1;
        tiyData.tParam.orderBy = sortBy;
        webList(this, tiyData);
      },
      categorySelected(value, selectedData) {
        //选择分类后的条件如果改变后要修改productBatchSequenceView方法里的判断条件
        if (0 < selectedData.length) {
          tiyData.tParam.choosedCategory = selectedData[selectedData.length - 1].value;
          tiyData.tParam.categoryLevel = selectedData[selectedData.length - 1].level;
        } else {
          tiyData.tParam.choosedCategory = '';
          tiyData.tParam.categoryLevel = 1;
        }
      },
      changePage(page) {
        tiyData.tPage.currentPage = page;
        webList(this, tiyData);
      },
      sizeChange(p) {
        tiyData.tPage.stepNumber = p;
        webList(this, tiyData);
      },
      showImage(imageUrl) {
        tiyData.tStatus.modalImage.url = imageUrl;
        tiyData.tStatus.modalImage.isShow = true;
      },
      close() {
        this.status.modalModify.isShow = false;
      },
      exportExcel(is_prefer, isExportAll) {
        exportExcel(this, tiyData, is_prefer, isExportAll);
      },
      showOrderList(index) {
        let productId = this.productList[index].id;
        showOrderList(this, tiyData, productId)
      },
      showOrderDetail(id) {
        this.isShowDetail = true;
        this.orderId = id;
      },
      hideDetail() {
        this.isShowDetail = false;
        this.orderId = "";
      },
      showExportDialog() {
        this.isShowExportDialog = true;
        this.productCodes = "";
      },
      productAddByCrawler() {
        toAddProductByCrawler(this, crawlerData);
        crawlerData.tStatus.modalAddByCrawler.isShow = true;
      },
      exportExcelForExhibit(){
        if(!tiyData.tParam.choosedCategory){
          this.$Modal.warning({
            title: '确认',
            content: '<p>先选择分类再导出</p>',
          })
        } else {
          exportExcelForExhibit(this, tiyData);
        }
      },
      updateCloudIndex() {
        this.$Spin.show();
        let self = this;
        this.$apiProduct.updateCloudIndex().then(function (response) {
          self.$Spin.hide();
          if (response.success) {
              self.$Message.success('上传产品搜索成功!');
          } else {
              self.$Message.error(response.errorMessage);
          }
        });
      },
      //保存新增产品，然后跳转至产品编辑界面
      saveAddProduct() {
        this.$refs.paramProductForm.validate(isValid => {
          if(isValid) {
            saveAddProduct(this, tiyData);
          }
        });
      },
      changeClassification() {
        tiyData.tData.classificationTreeShow.splice(0);
        let level1 = this.$refs.Tree.getCheckedAndIndeterminateNodes().filter(item=>item.level==1);
        tiyData.tParam.paramProduct.classificationIds = [];
        this.$refs.Tree.getCheckedNodes().forEach(function(item){
          if(item.level==3){
            tiyData.tParam.paramProduct.classificationIds.push(item.value);
          }
        })
        this.$refs.paramProductForm.validateField('classificationIds');
        level1.forEach((item1)=>{
          item1.children.forEach((item2)=>{
            if(item2.checked||item2.indeterminate){//2级分类选中或者半选
              item2.children.forEach((item3)=>{//3级分类选中
                if(item3.checked){
                  tiyData.tData.classificationTreeShow.push({'level1':item1.title,level2:item2.title,level3:item3.title});
                }
              });
            }
          });
        });
      },
      toggleExpand(data) {
        //展开分类，关闭同一级分类
        if(data.expand && data.level==1){
          tiyData.tData.classificationTree.forEach(function(item,index){
            if(data.value!=item.value&&item.expand==true){
              item.expand=false;
            }
          });
        }
      },
      generateRandomSKU() {
        let date = new Date();
        let dateStr = formatDate(date, "yyMMdd");
        let skuPrefix = parseInt(dateStr).toString(16);
        let skuSuffix = parseInt(this.getRandomStr(4)).toString(16);
        this.pCode = skuPrefix + skuSuffix;
      },
      getRandomStr(len=32) {
        const $chars = '1234567890';
        const maxPos = $chars.length;
        let str = '';
        for (let i = 0; i < len; i++) {
          str += $chars.charAt(Math.floor(Math.random() * maxPos));
        }
        return str;
      },
    showEmptyStock(){
        this.status.modalStockEmpty.isShow = true;
    }
    },
    components: {
      ICol,AImage,AProductAddEdit,AOrderDetail,AProductCrawler,AStockEmptyColor,KeyValueView,ListSort
    },
    computed: {
      pCode: {
        get: function(){
          return this.param.paramProduct.productCode.toUpperCase()
        },
        set : function(val){
          this.param.paramProduct.productCode = val.toUpperCase();
        }
      }
    },
    mounted() {
      init(this, tiyData);
      let types = [];
      types.push(1);//列表强制查询系统尺码、角标、分类和标签
      types.push(2);
      types.push(3);
      types.push(4);
      getProductCommonData(this, tiyData.tData.categoryList, types, true, createCategoryList);
    }
  }
  </script>

  <!--css样式-->
  <style lang="less" scoped>
  @import  (once,optional) "../css/base";

  .operation_item {
    text-align: left;
    margin-right: 16px;
  }

  .modal_newuser_form {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .modal_newuser_form_input {
    width: 200px;
    margin-right: 10px;
  }

  .form_step {
    width: 160px;
  }

  .modal_base_div {
    text-align: left;
    margin-top: 20px;
    padding: 20px;
    border: dotted thin #d1d1d1
  }

  .modal_base_div_title {
    text-align: left;
    margin-bottom: 10px
  }

  .list_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .list_item:hover {
    background: @tiySectionColor;
  }

</style>
